<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="icon" href="favicon.ico">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/iconfont.css">
    <link rel="stylesheet" href="./css/enter.css">
    <title>客户登录</title>
</head>

<body>
    <!-- 顶部 黄 s -->
    <div class="top">全新迪奥真我随行香氛，精美珠宝般玲珑瓶身，置于手袋小巧轻盈。全新真我用香方式呈现迪奥经典繁花香调，即刻探索。</div>
    <!-- 顶部 黄 e -->

    <!-- title s -->
    <div class="title">
        <ul>
            <li>
                <a href="#">
                    <em class="iconfont">&#xe605;</em>
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="./img/dior.png" alt="">
                </a>
            </li>
            <li>
                <a href="#">
                    <span class="iconfont">&#xe604;</span>
                    <span class="iconfont">&#xe685;</span>
                    <span class="iconfont">&#xe699;</span>
                </a>
            </li>
        </ul>
    </div>
    <!-- title e -->

    <div class="w">
        <!-- middle s -->
        <div class="middle">
            <h2>登录或创建帐户</h2>
            <form action="#" class="clearfix">
                <div class="fl left">
                    <div class="tab clearfix">
                        <span class="phone fl">手机验证码登录</span>
                        <ins class="account fr">账户密码登录</ins>
                    </div>
                    <div class="input-1">
                        <input type="text" placeholder="手机号">
                    </div>
                    <div class="input-2 clearfix">
                        <input type="text" placeholder="验证码" class="fl">
                        <span class="fr">vjcj</span>
                    </div>
                    <div class="input-3 clearfix">
                        <input type="text" placeholder="短信验证码" class="fl">
                        <button class="fr">发送</button>
                    </div>
                    <p>*未注册Dior官网账号的手机号，验证码登录时将自动注册。</p>
                    <div class="check">
                        <a href="#">
                            <input type="checkbox">
                            <span>我已阅读并接受</span><ins>个人信息收集声明</ins>
                        </a>
                    </div>
                    <div>
                        <button class="btn2">登录</button>
                    </div>
                    <div class="wx">
                        <span>使用第三方账号登录</span>
                        <img src="./img/wechat.png">
                        <img src="./img/alipay.png">
                    </div>
                </div>
                <div class="line"></div>
                <div class="fr right">
                    <p class="one">注册Dior账户</p>
                    <p>注册Dior账号以便追踪您的订单，</p>
                    <p>管理收货地址，获取更多个性化信息</p>
                    <div>创建账户</div>
                </div>
            </form>
            <p class="bottom-1">*请妥善保管您的注册账户信息，勿将账号及密码随意泄露给他人。</p>
            <p class="bottom-2">请注意，您的账户注册手机号为迪奥识别及验证您账户身份的唯一依据。</p>
        </div>
        <!-- middle e -->
    </div>

    <!-- footer s -->
    <div class="footer">
        <footer>
            <h3>国家/地区</h3>
            <button class="clearfix">
                <span class="iconfont fl">&#xe699;</span>
                中国 (CNY￥)
                <span class="iconfont fr">&#xe611;</span>
            </button>
            <div class="speak">
                <ul>
                    <li>
                        <h3>Europe</h3>
                        <ul>
                            <li>
                                <a href="#" class="is-ecommerce">Belgique
                                    (EUR€)</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">België
                                    (EUR€)</a>
                            </li>
                            <li>
                                <a href="#" class="">Deutschland (EUR€)</a>
                            </li>
                            <li>
                                <a href="#" class="">España</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">France
                                    (EUR€)</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">Italia
                                    (EUR€)</a>
                            </li>
                            <li>
                                <a href="#" class="">Россия</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">United
                                    Kingdom (GBP£)</a>
                            </li>
                            <li>
                                <a href="#" class="">Belgium</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">Netherlands
                                    (EUR€)</a>
                            </li>
                        </ul>
                    </li>
                    <li>
                        <h3>North America</h3>
                        <ul>
                            <li>United States (USD$)</li>
                        </ul>
                    </li>
                    <li>
                        <h3>Asia-Oceania</h3>
                        <ul>
                            <li>
                                <a href="#" class="is-ecommerce">中国 (CNY￥)</a>
                            </li>
                            <li>
                                <a href="#" class="">香港</a>
                            </li>
                            <li>
                                <a href="#" class="">Hong Kong</a>
                            </li>
                            <li>
                                <a href="#" class="is-ecommerce">日本 (JPY￥)</a>
                            </li>
                            <li>
                                <a href="#" class="">한국</a>
                            </li>
                            <li>
                                <a href="#" class="">台灣</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
            <ul class="foot-check">
                <li>
                    <a href="#"><ins>精品店</ins></a>
                </li>
                <li>
                    <a href="#"><ins>职业生涯</ins></a>
                </li>
                <li>
                    <a href="#"><ins>使用条款</ins></a>
                </li>
                <li>
                    <a href="#"><ins>数据保护章程</ins></a>
                </li>
            </ul>
            <p>
                <img src="./img/icp.png" alt="">
                <ins>沪公网安备31010602002343号</ins>
            </p>
            <p>
                <img src="./img/icp2.png" alt="">
                <ins>沪ICP19005922号</ins>
            </p>
            <p>尚圃电子商务（上海）有限公司</p>
            <p>上海市南京西路1266号恒隆广场1期29F</p>
        </footer>
    </div>

    <!-- footer e -->

</body>

</html>